<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html>
<head>
    <title>选课记录</title>
    <style>
        body { background: #f5f5f5; font-family: 'Microsoft YaHei', Arial, sans-serif; margin: 0; }
        .navbar {
            background-color: #363636;
            overflow: hidden;
            padding: 10px 20px;
            display: flex;
            justify-content: flex-end;
            align-items: center;
        }
        .navbar a {
            color: #f2f2f2;
            text-align: center;
            padding: 14px 20px;
            text-decoration: none;
            font-size: 17px;
            transition: background-color 0.3s, color 0.3s;
        }
        .navbar a:hover, .navbar a.active {
            background-color: #555;
            color: white;
        }
        .container {
            width: 90%;
            margin: 50px auto;
            background: #fff;
            border-radius: 8px;
            box-shadow: 0 2px 8px rgba(0,0,0,0.1);
            padding: 40px;
            text-align: center;
        }
        h2 { margin-bottom: 20px; color: #333; }
        table { width: 100%; border-collapse: collapse; margin-top: 20px; }
        th, td { border: 1px solid #ddd; padding: 10px; text-align: left; }
        th { background-color: #f2f2f2; color: #333; }
        tr:nth-child(even) { background-color: #f9f9f9; }
        .message { margin-top: 20px; padding: 10px; border-radius: 5px; }
        .success { background-color: #d4edda; color: #155724; border: 1px solid #c3e6cb; }
        .error { background-color: #f8d7da; color: #721c24; border: 1px solid #f5c6cb; }
        .status-selected { color: green; font-weight: bold; }
        .status-dropped { color: red; font-weight: bold; }
    </style>
</head>
<body>
<div class="navbar">
    <a href="index.jsp">首页</a>
    <a href="xuesheng_course_selection">选课</a>
    <a href="xuesheng_course_records" class="active">选课记录</a>
    <a href="xuesheng_personal_center">个人中心</a>
    <a href="logout">退出登录</a>
</div>
<div class="container">
    <h2>我的选课记录</h2>
    <table>
        <thead>
            <tr>
                <th>选课ID</th>
                <th>课程ID</th>
                <th>课程名称</th>
                <th>课程描述</th>
                <th>授课老师ID</th>
                <th>分数</th>
                <th>状态</th>
            </tr>
        </thead>
        <tbody>
            <c:forEach var="selection" items="${studentSelections}">
                <c:set var="course" value="${courseMap[selection.courseId]}"/>
                <tr>
                    <td><c:out value="${selection.id}"/></td>
                    <td><c:out value="${selection.courseId}"/></td>
                    <td><c:out value="${course.courseName}"/></td>
                    <td><c:out value="${course.courseDescription}"/></td>
                    <td><c:out value="${course.teacherId}"/></td>
                    <td><c:out value="${selection.score}"/></td>
                    <td>
                        <span class="<c:choose><c:when test="${selection.status eq '已选'}">status-selected</c:when><c:when test="${selection.status eq '已退选'}">status-dropped</c:when></c:choose>">
                            <c:out value="${selection.status}"/>
                        </span>
                    </td>
                </tr>
            </c:forEach>
            <c:if test="${empty studentSelections}">
                <tr>
                    <td colspan="7">暂无选课记录。</td>
                </tr>
            </c:if>
        </tbody>
    </table>

    <c:if test="${not empty errorMessage}">
        <p class="message error"><c:out value="${errorMessage}"/></p>
    </c:if>
    <c:if test="${not empty successMessage}">
        <p class="message success"><c:out value="${successMessage}"/></p>
    </c:if>
</div>
</body>
</html> 